<script>
    export default {
      data(){
        return{
          id: '',
          loading:false,
          stock:{
          },
          stockTypeValue:'',
        }
      },
      mounted(){
        let id = this.$route.query.id;
        this.id = id;
        console.log(this.id);
        this.getStock();
      },
      methods:{
        getStock(){
          this.$http({
            url: this.$http.adornUrl('/purchase/stock/findStock/'+this.id),
            method: 'get',
          }).then(res => {
            console.log(res);
            this.stock=res.stock;
          })
        }
      }
    }
</script>

<template>
  <div>
    <!--空骨架-->
    <template>
      <el-skeleton :rows="7"
                   :animated="true"
                   :loading="loading"
                   :throttle="500"/>
    </template>
    <div v-if="!loading">
      <div class="div1" >
        <el-descriptions title="编制采购计划" :column="2" border>
          <el-descriptions-item label="采购计划编号">
            {{stock.stockNum}}
          </el-descriptions-item>
          <el-descriptions-item label="采购计划名称">
            {{stock.stockName}}
          </el-descriptions-item>
          <el-descriptions-item label="公司名称">
            {{stock.company}}
          </el-descriptions-item>
          <el-descriptions-item label="编制人">
            {{stock.author}}
          </el-descriptions-item>
          <el-descriptions-item label="预算金额(元)">
            <el-input v-model="stock.budget" placeholder="预算金额"></el-input>
          </el-descriptions-item>
          <el-descriptions-item label="计划询价开始时间">
            {{stock.startDate}}
          </el-descriptions-item>
          <el-descriptions-item label="计划报价截止时间">
            {{stock.endDate}}
          </el-descriptions-item>
        </el-descriptions>
      </div>
      <template>
        <el-table
          :data="stock.ordersList"
          style="width: 100%"
          stripe
          border>
          <el-table-column
            align="center"
            prop="id"
            label="序号"
            width="50">
          </el-table-column>
          <el-table-column
            prop="materialNum"
            label="物资编码"
            width="200">
          </el-table-column>
          <el-table-column
            prop="materialName"
            label="物资名称"
            width="190">
          </el-table-column>
          <el-table-column
            prop="amount"
            label="数量"
            width="150">
          </el-table-column>
          <el-table-column
            prop="measureUnit"
            label="计量单位"
            width="100">
          </el-table-column>
          <el-table-column
            prop="startDate"
            label="交货期"
            width="200">
          </el-table-column>
          <el-table-column
            prop=""
            label="协议价格"
            width="140">
          </el-table-column>
          <el-table-column
            prop="sumPrice"
            label="预算总金额"
            width="140">
          </el-table-column>
          <el-table-column
            prop=""
            label="计划价(元/不含税)"
            width="192">
          </el-table-column>
        </el-table>
      </template>

      <div class="div2">
        <el-descriptions class="margin-top" :column="1" border>
          <el-descriptions-item label="采购方式">
            {{stock.stockType}}
          </el-descriptions-item>
          <el-descriptions-item label="可选供应商">
            可选供应商
          </el-descriptions-item>
          <el-descriptions-item label="本产品所有供应商">
            <el-tag
              v-for="tag in stock.supplierList"
              :key="tag.company">
              {{tag.company}}
            </el-tag>
          </el-descriptions-item>
          <el-descriptions-item label="说明">
            <el-input v-model="stock.remark"
              type="textarea"
              :rows="1">
            </el-input>
          </el-descriptions-item>
          <el-descriptions-item label="部长是否同意">
            {{stock.leadAgree}}
          </el-descriptions-item>
          <el-descriptions-item label="部长审核意见">
            <el-input v-model="stock.leadOpinion"
              type="textarea"
              :rows="2">
            </el-input>
          </el-descriptions-item>
        </el-descriptions>
      </div>
    </div>
  </div>
</template>

<style scoped lang="scss">
::v-deep .el-descriptions-item__cell.el-descriptions-item__content .el-input .el-input__inner {
  width: 150px;
}
.div1 ::v-deep .el-descriptions-row .el-descriptions-item__cell.el-descriptions-item__label.is-bordered-label {
  width: 200px;
}
.div2 ::v-deep .el-descriptions-item__cell.el-descriptions-item__label.is-bordered-label{
  width: 200px;
  height: 30px;
}
::v-deep .el-descriptions-row .el-descriptions-item__cell.el-descriptions-item__content .el-tag.el-tag--light{
  margin-left: 10px;
}
</style>
